<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>教务中心-登录</title>
    <link type="text/css" rel="stylesheet" th:href="@{/css/style.css}"/>
</head>
<body>
<form action="/login" method="post" class="login-form">
    <h1>登录</h1>

    <div class="txtb">
        <input type="text" id="user_id" name="user_id" autocomplete="off"/>
        <span data-placeholder="用户名"></span>
    </div>

    <div class="txtb">
        <input type="password" id="password" name="password" autocomplete="off"/>
        <span data-placeholder="密码"></span>
    </div>

    <input type="submit" class="logbtn" value="登录"/>

    <div class="bottom-text" th:inline="text">
        Tips:教职工以职工号登录/学生以学号登录
        <div class="error">[[${error}]]</div>
    </div>
</form>
</body>
<script th:src="@{/js/jquery/jquery-3.4.1.js}"></script>
<script type="text/javascript">
    $(".txtb input").on("focus",function () {
        $(this).addClass("focus")
    });

    $(".txtb input").on("blur",function () {
        if($(this).val() == ""){
            $(this).removeClass("focus");
        }
    })
</script>
</html>